<template>
  {{ msg }}
  <button @click="sendMessage">发送消息</button>
  <div v-if="userStore?.userInfo?.name">
    {{ userStore?.userInfo?.name }}-{{ userStore?.userInfo?.age }}-{{
      userStore?.userInfo?.gender
    }}-{{ userStore?.userInfo?.phone }}
  </div>
</template>

<script setup lang="ts">
import { ref } from "vue";
import { dispatchReceiveMessageEvent } from "@/utils/dispatchReceiveMessageEvent";
import { useUserStore } from "@/store/user";

const userStore = useUserStore();

const props = defineProps({
  msg: String,
});

function sendMessage() {
  dispatchReceiveMessageEvent({
    name: "李四",
    age: 22,
    gender: "男",
    phone: "13000000001",
  });
}
</script>

<style scoped>
.read-the-docs {
  color: #888;
}
</style>
